import path from "path";
import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import viteCompression from "vite-plugin-compression";
import { viteSingleFile } from "vite-plugin-singlefile";
import { terser } from "rollup-plugin-terser";

//自动按需导入element plus
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";

//自动按需导入icons
import IconResolver from "unplugin-icons/resolver";
import Icons from "unplugin-icons/vite";

console.log(process.env.NODE_ENV);
const mode = process.env.NODE_ENV;

const pathSrc = path.resolve(__dirname, "src");

// https://vitejs.dev/config/
export default defineConfig({
  resolve: {
    alias: {
      "~/": `${pathSrc}/`,
    },
  },
  plugins: [
    vue(),
    viteCompression(),
    viteSingleFile(),
    AutoImport({
      // 自动导入vue相关的Api
      imports: ["vue", "vue-router"],
      dts: "src/auto-import.d.ts",
      resolvers: [ElementPlusResolver(), IconResolver({ prefix: "Icon" })],
    }),
    Components({
      extensions: ["vue", "md"],
      include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
      // 解析的 UI 组件库，这里以 Element Plus 为例
      resolvers: [
        ElementPlusResolver({ importStyle: "sass" }),
        IconResolver({ enabledCollections: ["ep"] }),
      ],
      deep: true,
      dts: "src/components.d.ts",
    }),
    Icons({ scale: 1, defaultClass: "inline-block", autoInstall: true }),
  ],
  build: {
    minify: "terser",
    rollupOptions: {
      plugins: [
        terser({
          format: {
            // 取消代码注释
            comments: false,
          },

          mangle: {
            keep_classnames: false,
            reserved: [],
          },
        }),
      ],
    },
  },
  esbuild: {
    /* 去掉 console 和 debugger 输出 */
    // drop: mode === "production" ? ["console", "debugger"] : [],
    drop: mode === "production" ? ["debugger"] : [],
  },
});
